<template>
  <div>
    <TableMain :dataOrigin="dataOrigin"></TableMain>
  </div>
</template>

<script>

/**
 * 右侧内容的区域的模板示例
 * 1. 引入模板组件 TableMain tableMain 中是内容区域的主体
 * 2. 根据接口返回的参数和参数名称配置表格内容
 *    dataOrigin{ 表格的原始数据结构
 *      dataSource: [], 表格数据的元数据
 *      dataSourceChangeCopy: [], 表格数据的备份数据
 *      columns: [], 表格结构定义
 *      seniorParam: [], 高级搜索需要展示的字段信息
 *      addParam: [], 新增元素需要填写的字段信息
 *      editParam: [], 编辑元素需要修改的字段信息
 *      requestUrl:{ list: '',  add: '', delete: '', modify: '', other:'' } 当前页面需要请求的地址, 在对象中添加对应的url信息即可
 *    }
 * 3. 如果需要展示表格列表，请使用此页面，按照上面的结构进行数据的初始化和定义处理
 */


import TableMain from '../../components/drugCommon/TableMain'
export default {
  name: 'identity',
  components:{
    TableMain
  },
  data(){
    return{
      // 表格的原始数据结构 -- dataOrigin
      dataOrigin: {
        dataSource: [ // 表格数据的元数据 -- dataSource
          { title: '序号', param: 'index',   index: 0,  width: 100 },
          { title: '年龄', param: 'age',     index: 1,  width: 100 },
          { title: '姓名', param: 'name',    index: 2,  width: 100 },
          { title: '地址', param: 'address', index: 3,  width: 100 },
          { title: '标签', param: 'tags',    index: 4,  width: 100 },
          { title: '操作', param: 'action',  index: 5,  width: 100 }
        ],
        dataSourceChangeCopy: [ // 表格数据的备份数据 -- dataSourceChangeCopy
          { title: '序号', param: 'index',   index: 0, width: 100 },
          { title: '年龄', param: 'age',     index: 1, width: 100 },
          { title: '姓名', param: 'name',    index: 2, width: 100 },
          { title: '地址', param: 'address', index: 3, width: 100 },
          { title: '标签', param: 'tags',    index: 4, width: 100 },
          { title: '操作', param: 'action',  index: 5, width: 100 }
        ],
        columns: [ // 表格结构定义 -- columns
          {
            title: '序号',
            dataIndex: 'index',
            key: 'index',
            width: 70,
            fixed: 'left',
            scopedSlots: { customRender: 'index' },
          },
          {
            title: '年龄',
            dataIndex: 'age',
            key: 'age',
            ellipsis: true,
            defaultSortOrder: 'descend',
            sortDirections: ['descend', 'ascend'],
            sorter: (a, b) => a.age - b.age,
            scopedSlots: { customRender: 'age' },
          },
          {
            dataIndex: 'name',
            key: 'name',
            title: '姓名',
            ellipsis: true,
            scopedSlots: { customRender: 'name' },
          },
          {
            title: '地址',
            dataIndex: 'address',
            key: 'address',
            ellipsis: true,
          },
          {
            title: '标签',
            key: 'tags',
            dataIndex: 'tags',
            scopedSlots: { customRender: 'tags' },
            ellipsis: true,
          },
          {
            title: '操作',
            key: 'action',
            scopedSlots: { customRender: 'action'},
            width: 140,
            fixed: 'right',
            dataIndex: 'action',
          }
        ],

        // 高级搜索需要展示的字段信息 -- seniorParam
        seniorParam: [
          { title: '年龄', keys: 'age',     searchType: 'DrugBaseNumber',  placeholder: '请输入年龄',  value: '' },
          { title: '姓名', keys: 'name',    searchType: 'DrugBaseInput',  placeholder: '请输入姓名',  value: '' },
          { title: '地址', keys: 'address', searchType: 'DrugBaseTextarea',  placeholder: '请输入地址',  value: '' },
        ],
        
        // 新增元素需要填写的字段信息 -- addParam
        addParam: [
          { 
            title: '年龄', 
            keys: 'age',     
            addType: 'DrugBaseNumber',  
            placeholder: '请输入年龄',  
            value: '',
            validateObj:[ // 添加需要的验证方式即可
              { name: 'commonValidate', msg: '请输入年龄', regExp: "" }
            ]
          },
          { 
            title: '姓名', 
            keys: 'name',    
            addType: 'DrugBaseInput',  
            placeholder: '请输入姓名',  
            value: '',
            validateObj:[
              { name: 'commonValidate', msg: '请输入姓名', regExp: /\S/ },
              { name: 'commonValidate', msg: '长度不合法，长度限制 4~16', regExp: "^[^\s]{4,16}$" }
            ]
          },
          { 
            title: '地址',
            keys: 'address',
            addType: 'DrugBaseTextarea',
            placeholder: '请输入地址',
            value: '',
            validateObj:[
              { name: 'commonValidate', msg: '请输入地址', regExp: /\S/ },
              { name: 'commonValidate', msg: '长度不合法，长度限制 4~16', regExp: "^[^\s]{4,16}$" }
            ]
          }
        ],
        
        // 编辑元素需要修改的字段信息 -- editParam
        editParam: [
          { 
            title: '年龄', 
            keys: 'age',     
            editType: 'DrugBaseNumber',  
            placeholder: '请输入年龄',  
            value: '',
            validateObj:[
              { name: 'commonValidate', msg: '请输入姓名', regExp: /\S/ },
              { name: 'commonValidate', msg: '长度不合法，长度限制 4~16', regExp: `^[^\s]{4,16}$` }
            ]
          },
          { 
            title: '姓名', 
            keys: 'name',    
            editType: 'DrugBaseInput',  
            placeholder: '请输入姓名',  
            value: '',
            validateObj:[
              { name: 'commonValidate', msg: '请输入姓名', regExp: /\S/ },
              { name: 'commonValidate', msg: '长度不合法，长度限制 4~16', regExp: `^[^\s]{4,16}$` }
            ]
          },
          { 
            title: '地址', 
            keys: 'address', 
            editType: 'DrugBaseTextarea',  
            placeholder: '请输入地址',  
            value: '',
            validateObj:[
              { name: 'commonValidate', msg: '请输入姓名', regExp: /\S/ },
              { name: 'commonValidate', msg: '长度不合法，长度限制 4~16', regExp: `^[^\s]{4,16}$` }
            ]
          },
          { 
            title: '手机号码', 
            keys: 'phone', 
            editType: 'DrugBaseTextarea',  
            placeholder: '请输入手机号码',  
            value: '',
            validateObj:[
              { name: 'commonValidate', msg: '请输入姓名', regExp: /\S/ },
              { name: 'commonValidate', msg: '手机格式错误', regExp: "" }
            ]
          },
          { 
            title: '邮箱地址', 
            keys: 'email', 
            editType: 'DrugBaseTextarea',  
            placeholder: '请输入邮箱地址',  
            value: '',
            validateObj:[
              { name: 'commonValidate', msg: '请输入姓名', regExp: /\S/ },
              { name: 'commonValidate', msg: '邮箱地址格式错误', regExp: "" }
            ]
          }
        ],

        // 当前页面的请求地址 -- requestUrl
        requestUrl: {
          list: '111111.json',    // 列表信息
          add: '222222.json',     // 新增信息
          delete: '333333.json',  // 删除信息
          modify: '4444444.json', // 修改编辑信息
          other: '....',          // 额外的需要增加的接口地址
        }
        
      }
    }
  },

  created() {
  },

  methods: {

  }
}
</script>


<style lang="less" scoped>
 
</style>
